import React from 'react'
import { Table, Button, Transfer, Modal } from 'antd';
const { Column } = Table;
const dataSource = [
    {
        key: '1',
        name: '胡彦斌',
        need: '南门、二环到三环、50-60万、3居室',
        time: '2015-02-04  06:22:15',
    },
    {
        key: '2',
        name: '胡彦祖',
        need: '南门、二环到三环、50-60万、3居室',
        time: '2015-02-04  06:22:15',
    },
];


class Pubtable extends React.Component {
    constructor() {
        super()
        this.state = {
            mockData: [
                { key: '1', name: '王大锤1', },
                { key: '2', name: '王大锤2', },
                { key: '3', name: '王大锤3', },
                { key: '4', name: '王大锤4', },
                { key: '5', name: '王大锤5', },
            ],
            targetKeys: [],
            visible: false
        }
    }


    fenpei = (rowdata) => {
        // console.log(rowdata);
        // console.log(this.props.tabkey);
        this.setState({
            visible: true
        })
    }
    //modal
    handleOk = e => {
        console.log(e);
        this.setState({
            visible: false,
        });
    };

    handleCancel = e => {
        this.setState({
            visible: false,
        });
    };
    //Transfer
    handleChange = async targetKeys => {
        await this.setState({ targetKeys });
        console.log(this.state.targetKeys);
    };

    render() {
        return (
            <div>
                <Table pagination={{ pageSize: 5, position: ['bottomCenter'] }} dataSource={dataSource}  >
                    <Column width='25%' title="会员" dataIndex="name" key="account" />
                    <Column width='25%' title="找房需求" dataIndex="need" key="userName" />
                    <Column width='25%' title="提交时间" dataIndex="time" key="time" />
                    <Column width='25%' title="操作" dataIndex="action" key="action"
                        render={(text, record) => (
                            <Button onClick={this.fenpei.bind(this, record)}>
                                {this.props.tabkey === '1' ? '分配' : '管理报告'}
                            </Button>
                        )}
                    />
                </Table>
                <Modal
                    style={{ textAlign: 'center' }}
                    title="分配楼盘分析师"
                    visible={this.state.visible}
                    onOk={this.handleOk}
                    onCancel={this.handleCancel}
                    okText="确认"
                    cancelText="取消"
                >
                    <Transfer
                        locale={{ itemUnit: '人', itemsUnit: '人', }}
                        titles={['可选', '已选']}
                        dataSource={this.state.mockData}
                        showSelectAll={false}
                        targetKeys={this.state.targetKeys}
                        onChange={this.handleChange}
                        render={item => item.name}
                    />
                </Modal>
            </div>
        )
    }
}
export default Pubtable